<!DOCTYPE html>
<html style="background-color: #f2f2f2;" lang="en">
<%include("/common/header.html",{title:''}){}%>
<body>
<div class="layui-fluid">
  <div class="layui-row layui-col-space15">

    <div class="layui-row layui-col-space15">
      <div class="layui-col-md6">
        <div class="layui-card">
          <div class="layui-card-header">快捷方式</div>
          <div class="layui-card-body">

            <div class="layui-carousel layadmin-carousel layadmin-shortcut">
              <div carousel-item>
                <ul class="layui-row layui-col-space10">
                  <li class="layui-col-xs3">
                    <a lay-href="home/homepage1.html">
                      <i class="layui-icon layui-icon-console"></i>
                      <cite>植物百科</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="home/homepage2.html">
                      <i class="layui-icon layui-icon-chart"></i>
                      <cite>巡查运维</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="component/layer/list.html">
                      <i class="layui-icon layui-icon-template-1"></i>
                      <cite>健康模块</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a layadmin-event="im">
                      <i class="layui-icon layui-icon-chat"></i>
                      <cite>考勤管理</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="component/progress/index.html">
                      <i class="layui-icon layui-icon-find-fill"></i>
                      <cite>卫生清理</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="app/workorder/list.html">
                      <i class="layui-icon layui-icon-survey"></i>
                      <cite>绿地养护</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="user/user/list.html">
                      <i class="layui-icon layui-icon-user"></i>
                      <cite>植保管理</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="set/system/website.html">
                      <i class="layui-icon layui-icon-set"></i>
                      <cite>设施维护</cite>
                    </a>
                  </li>
                </ul>
                <ul class="layui-row layui-col-space10">
                  <li class="layui-col-xs3">
                    <a lay-href="set/user/info.html">
                      <i class="layui-icon layui-icon-set"></i>
                      <cite>我的资料</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="set/user/info.html">
                      <i class="layui-icon layui-icon-set"></i>
                      <cite>我的资料</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="set/user/info.html">
                      <i class="layui-icon layui-icon-set"></i>
                      <cite>我的资料</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="set/user/info.html">
                      <i class="layui-icon layui-icon-set"></i>
                      <cite>我的资料</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="set/user/info.html">
                      <i class="layui-icon layui-icon-set"></i>
                      <cite>我的资料</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="set/user/info.html">
                      <i class="layui-icon layui-icon-set"></i>
                      <cite>我的资料</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="set/user/info.html">
                      <i class="layui-icon layui-icon-set"></i>
                      <cite>我的资料</cite>
                    </a>
                  </li>
                  <li class="layui-col-xs3">
                    <a lay-href="set/user/info.html">
                      <i class="layui-icon layui-icon-set"></i>
                      <cite>我的资料</cite>
                    </a>
                  </li>
                </ul>

              </div>
            </div>

          </div>
        </div>
      </div>

      <div class="layui-col-md6">
        <div class="layui-card">
          <div class="layui-card-header">待办事项</div>
          <div class="layui-card-body">

            <div class="layui-carousel layadmin-carousel layadmin-backlog">
              <div carousel-item>
                <ul class="layui-row layui-col-space10">
                  <li class="layui-col-xs6">
                    <a lay-href="app/content/comment.html" class="layadmin-backlog-body">
                      <h3>未完成巡查</h3>
                      <p><cite style="color: #FF5722;" id="wwcxc">0</cite></p>
                    </a>
                  </li>
                  <li class="layui-col-xs6">
                    <a lay-href="app/forum/list.html" class="layadmin-backlog-body">
                      <h3>绿地养护</h3>
                      <p><cite id="lv">0</cite></p>
                    </a>
                  </li>
                  <li class="layui-col-xs6">
                    <a lay-href="template/goodslist.html" class="layadmin-backlog-body">
                      <h3>卫生清理</h3>
                      <p><cite id="ws">0</cite></p>
                    </a>
                  </li>
                  <li class="layui-col-xs6">
                    <a href="javascript:" onclick="layer.tips('不跳转', this, {tips: 3});"
                       class="layadmin-backlog-body">
                      <h3>设施维护</h3>
                      <p><cite id="ss">0</cite></p>
                    </a>
                  </li>
                </ul>
                <!--<ul class="layui-row layui-col-space10">
                  <li class="layui-col-xs6">
                    <a href="javascript:" class="layadmin-backlog-body">
                      <h3>待审友情链接</h3>
                      <p><cite style="color: #FF5722;">5</cite></p>
                    </a>
                  </li>
                </ul>-->
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="layui-col-sm12">
        <div class="layui-row layui-col-space15">
          <div class="layui-col-sm6">
            <div class="layui-card">
              <div class="layui-card-header">精细养护统计</div>
              <div class="layui-card-body">
                <table class="layui-table" lay-skin="line">
                  <tbody>
                  <tr>
                    <td>
                      <div id="container" style="width:100%; height:300px"></div>
                    </td>
                  </tr>
                  </tbody>
                </table>
              </div>
            </div>
          </div>
          <div class="layui-col-sm6">
            <div class="layui-card">
              <div class="layui-card-header">巡查逐月统计</div>
              <div class="layui-card-body">
                <table class="layui-table" lay-skin="line">
                  <tbody>
                  <tr>
                    <td>
                      <div id="container2" style="width:100%; height:300px"></div>
                    </td>
                  </tr>
                  </tbody>
                </table>
              </div>
            </div>
          </div>
          <div class="layui-col-sm6">
            <div class="layui-card">
              <div class="layui-card-header">当月健康异常统计</div>
              <div class="layui-card-body">
                <table class="layui-table" lay-skin="line">
                  <tbody>
                  <tr>
                    <td>
                      <div id="container3" style="width:100%; height:300px"></div>
                    </td>
                  </tr>
                  </tbody>
                </table>
              </div>
            </div>
          </div>
          <div class="layui-col-sm6">
            <div class="layui-card">
              <div class="layui-card-header">当月缺勤人数统计</div>
              <div class="layui-card-body">
                <table class="layui-table" lay-skin="line">
                  <tbody>
                  <tr>
                    <td>
                      <div id="container4" style="width:100%; height:300px"></div>
                    </td>
                  </tr>
                  </tbody>
                </table>
              </div>
            </div>
          </div>
          <div class="layui-col-sm6">
            <div class="layui-card">
              <div class="layui-card-header">养护列表</div>
              <div class="layui-card-body">
                <table class="layui-hide" id="demo"></table>
              </div>
            </div>
          </div>
          <div class="layui-col-sm6">
            <div class="layui-card">
              <div class="layui-card-header">巡查列表（未完成的）</div>
              <div class="layui-card-body">
                <table class="layui-hide" id="demo01"></table>
              </div>
            </div>
          </div>

        </div>
      </div>
    </div>
  </div>
</div>
<%include("/common/foot.html"){}%>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<script>
  var $;
  layui.use(['index', 'console','table'], function () {
    /*  var $A = layui.AjaxCommon;
      var al = layui.AliangLayui;
      $A.ajax('http://route.showapi.com/32-9', 'post', 'json', {
        'showapi_appid': 28043,
        'showapi_sign': 'fd5ce066f69441bfa078c0ad16129b15',
        'q': 'hello'
      }, function (res) {
        //alert(JSON.stringify(res));
      });*/
     $ = layui.jquery;
    var table = layui.table;
    //展示已知数据
    table.render({
      elem: '#demo'
      ,cols: [[ //标题栏
        {templet: '<div>{{d.greedLand.greedLandAdministrator.name}}</div>' ,title:'绿地名称', sort: true}
        ,{templet: '<div>{{d.maintenType.name}}</div>', title: '养护内容' ,sort: true}
        ,{field: 'peopleNum', title: '数量',sort: true}
        ,{field: 'maintenanceDate', title: '养护时间',sort: true}
      ]]
      ,url:'mainten/sglist.json'
      ,skin: 'line' //表格风格
      ,even: true
      //,page: true //是否显示分页
      //,limits: [5, 7, 10]
      ,limit: 7 //每页默认显示的数量
    });
    table.render({
      elem: '#demo01'
      ,cols: [[ //标题栏
        {templet: '<div>{{d.source}}</div>' ,title:'任务名称', sort: true}
        ,{templet: '<div>{{d.situation}}</div>', title: '问题情况' ,sort: true}
        ,{field: 'publishTime', title: '发布时间',sort: true}
        ,{field: 'completeTime', title: '要求完成时间',sort: true}
      ]]
      ,url:'system/count/unCompleteList.jhtml'
      ,skin: 'line' //表格风格
      ,even: true
      //,page: true //是否显示分页
      //,limits: [5, 7, 10]
      ,limit: 7 //每页默认显示的数量
    });
  });
  (function () {
    /*----------------施工角色-健康异常统计-Start--------------------*/
    let admin_healthy_static = new Promise(function (resolve, reject) {
      $.ajax({
        url: "system/healthy_statistics/admin_healthy_static.json",
        type: "POST",
        data: {},
        dataType: "json",
        success: function (ret) {
          if (ret) {
            resolve(ret);
          } else {
            alert("网络异常，请稍后再试吧" + JSON.stringify(err))
          }
        },
        error: function (jqXHR, textStatus, errorThrown) {
        }
      });
    });
    admin_healthy_static.then(data => {
      admin_healthy_static_fn(data.worklist, data.daylist);
    });
    /*----------------施工角色-健康异常统计-END---------------------*/

    /*----------------施工角色-缺勤统计-Start--------------------*/
    let admin_att_static = new Promise(function (resolve, reject) {
      $.ajax({
        url: "system/att_checkwork/admin_att_static.json",
        type: "POST",
        data: {},
        dataType: "json",
        success: function (ret) {
          if (ret) {
            resolve(ret);
          } else {
            alert("网络异常，请稍后再试吧" + JSON.stringify(err))
          }
        },
        error: function (jqXHR, textStatus, errorThrown) {
        }
      });
    });
    admin_att_static.then(obj => {
      admin_att_static_fn(obj.worklist, obj.daylist);

    });
    /*----------------施工角色-缺勤统计-END--------------------*/

    /*----------------施工角色-精细养护-Start--------------------*/
    let mainten = new Promise(function (resolve, reject) {
      $.ajax({
        url: "maintenstatistics/sgtop.json",
        type: "POST",
        data: {},
        dataType: "json",
        success: function (ret) {
          if (ret) {
            resolve(ret);
          } else {
            alert("网络异常，请稍后再试吧" + JSON.stringify(err))
          }
        },
        error: function (jqXHR, textStatus, errorThrown) {
        }
      });
    });
    mainten.then(obj => {
      var data = JSON.parse(obj.data);
      $("#lv").text(data.lv);
      $("#ws").text(data.ws);
      $("#ss").text(data.ss);
      $("#zb").text(data.zb);
      mainten_fn(data.lv,data.ws,data.ss,data.zb);

    });
    /*----------------施工角色-精细养护-END--------------------*/



    /*----------------施工角色-巡查豆腐-Start--------------------*/
    let wwcxc = new Promise(function (resolve, reject) {
      $.ajax({
        url: "system/count/patrolUnComplete.jhtml",
        type: "POST",
        data: {},
        dataType: "json",
        success: function (ret) {
          if (ret) {
            resolve(ret);
          } else {
            alert("网络异常，请稍后再试吧" + JSON.stringify(err))
          }
        },
        error: function (jqXHR, textStatus, errorThrown) {
        }
      });
    });
    wwcxc.then(obj => {
      $("#wwcxc").text(obj.obj);

    });
    /*----------------施工角色-巡查豆腐-END--------------------*/



    function mainten_fn(lv,ws,ss,zb) {
      //饼图（精细养护）
      var dom = document.getElementById("container");
      var myChart = echarts.init(dom);
      var app = {};
      option = null;
      option = {
        color: ['#60acfc', '#5bc49f', '#ff7c7c', '#9287e7'],
        title: {
          text: '精细养护分类占比',
          subtext: '四大分类',
          left: 'center'
        },
        tooltip: {
          trigger: 'item',
          formatter: '{a} <br/>{b} : {c} ({d}%)'
        },
        legend: {
          orient: 'vertical',
          left: 'left',
          data: ['绿地养护', '卫生清理', '设施维护', '植保管理']
        },
        series: [
          {
            name: '精细养护分类',
            type: 'pie',
            radius: '55%',
            center: ['50%', '60%'],
            data: [
              {value: lv, name: '绿地养护'},
              {value: ws, name: '卫生清理'},
              {value: ss, name: '设施维护'},
              {value: zb, name: '植保管理'},

            ],
            emphasis: {
              itemStyle: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
              }
            }
          }
        ]
      };
      if (option && typeof option === "object") {
        myChart.setOption(option, true);
      }
    }

    //////////////////////////////////////////////////////

    //////////////////////////////////////////////////////
    //柱图（巡查逐月）
    var dom = document.getElementById("container2");
    var myChart = echarts.init(dom);
    var app = {};
    option = null;
    option = {
      title: {
        text: '巡查次数逐月统计',
        subtext: '完成/未完成'
      },
      tooltip: {
        trigger: 'axis'
      },
      legend: {
        data: ['完成', '未完成']
      },
      calculable: true,
      xAxis: [
        {
          type: 'category',
          data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
        }
      ],
      yAxis: [
        {
          type: 'value'
        }
      ],
      series: [
        {
          name: '完成',
          type: 'bar',
          color: '#60ACFC',
          data: [12, 9, 22, 18, 19, 8, 30, 25, 21, 23, 18, 19],
          markPoint: {
            data: [
              {type: 'max', name: '最大值'},
              {type: 'min', name: '最小值'}
            ]
          },
          markLine: {
            data: [
              {type: 'average', name: '平均值'}
            ]
          }
        },
        {
          name: '未完成',
          type: 'bar',
          color: '#AFE39B',
          data: [1, 3, 1, 4, 3, 5, 1, 1, 1, 1, 2, 1],
          markPoint: {
            data: [
              {name: '年最高', value: 182.2, xAxis: 7, yAxis: 183},
              {name: '年最低', value: 2.3, xAxis: 11, yAxis: 3}
            ]
          },
          markLine: {
            data: [
              {type: 'average', name: '平均值'}
            ]
          }
        }
      ],
      grid: {
        left: '3%',
        right: '4%',
        bottom: '0%',
        top: '25%',
        containLabel: true
      }
    };
    if (option && typeof option === "object") {

      myChart.setOption(option, true);
    }


    function admin_healthy_static_fn(worklist, daylist) {
      //折线图（健康异常）
      var dom = document.getElementById("container3");
      var myChart = echarts.init(dom);
      var app = {};
      option = null;
      option = {
        color: '#66AFFC',
        tooltip: {
          trigger: 'axis'
        },
        xAxis: {
          type: 'category',
          data: daylist
        },
        yAxis: {
          type: 'value'
        },
        series: [{
          name: '异常',
          data: worklist,
          type: 'line',
          smooth: true
        }]
      };
      if (option && typeof option === "object") {
        myChart.setOption(option, true);
      }
    }

    //////////////////////////////////////////////////////
    function admin_att_static_fn(worklist, daylist) {
//折线图（缺勤人数）
      var dom = document.getElementById("container4");
      var myChart = echarts.init(dom);
      var app = {};
      option = null;
      option = {
        color: '#5FC5A1',
        tooltip: {
          trigger: 'axis'
        },
        xAxis: {
          type: 'category',
          data: daylist
        },
        yAxis: {
          type: 'value'
        },
        series: [{
          name: '缺勤',
          data: worklist,
          type: 'line',
          smooth: true
        }]
      };
      if (option && typeof option === "object") {
        myChart.setOption(option, true);
      }
    }
  }())

</script>
</body>
</html>